<!doctype html>
<html>
<head>
	<title>自动模拟 - 从偏见开始</title>
	<link href="automatic.css" rel="stylesheet" type="text/css">
	<link href="doubleslider.css" rel="stylesheet" type="text/css">
</head>
<body>
	<div id="container">
		<canvas id="canvas" width="600" height="600"></canvas>
		<div id="stats">

			<div id="stats_canvas_container">
				<canvas id="stats_canvas" width="370" height="270"></canvas>
				<div id="stats_text"></div>
			</div>

			如果 <span class="highlight"><span id="bias_text">33%</span>以下</span> 的邻居和我一样，我就移动出去
			<br>
			<div id="slider"></div>
			<br>

			<div class="ui" id="moving" onclick="START_SIM=!START_SIM; doneBuffer = 60; window.writeStats()"></div>
			<div class="ui" id="reset" onclick="reset()" style="margin-left:9px"></div>
		</div>
	</div>
</body>
</html>

<script src="../lib/Mouse.js"></script>
<script src="automatic.js"></script>
<script src="automatic_start_segregated.js"></script>
<script src="doubleslider.js"></script>
<script>
doneBuffer=-1;

var bias_text = document.getElementById("bias_text");

var whatever = new DoubleSlider(document.getElementById("slider"),{
	backgrounds:[
		{color:"#555",icon:"ds_sad.png"},
		{color:"#aaa",icon:"ds_happy.png"},
		{color:"#2095dc",icon:"ds_sad.png"}
	],
	values:[0.33,1.02],
	onChange:function(values){
		
		window.BIAS = values[0];

		// Write stats
		START_SIM = false;
		window.writeStats();
		bias_text.innerHTML = Math.round(window.BIAS*100)+"%";

	}
});

</script>
